<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>{dreamer-cms:global name="title" /}</title>
  <link rel="icon" href="{dreamer-cms:template /}images/favicon.ico" />
  <meta name="Keywords" content="{dreamer-cms:global name='keywords' /}" />
  <meta name="Description" content="{dreamer-cms:global name='describe' /}" />
  <link href="{dreamer-cms:template /}css/output.css" rel="stylesheet" />
  <link rel="stylesheet" href="{dreamer-cms:template /}css/swiper-bundle.min.css" />
  <link rel="stylesheet" href="{dreamer-cms:template /}js/theme/default/layer.css">
  <link rel="stylesheet" href="{dreamer-cms:template /}css/variables.css" />
  <script src="{dreamer-cms:template /}js/jquery-1.11.3.min.js"></script>
  <script src="{dreamer-cms:template /}js/swiper-bundle.min.js"></script>
  <script src="{dreamer-cms:template /}js/layer.js"></script>
</head>

<body class="bg-white">
  <div class="sticky top-0 z-50">
    {dreamer-cms:include file='inc/header.html'/}
  </div>

  <main>
    <!-- 轮播图 -->
    <div class="swiper mySwiper h-[200px] md:h-[400px] xl:h-[734px]">
      <div class="swiper-wrapper">
        {dreamer-cms:list typeid="310p8324" formkey="h4j2gb6u" addfields="href" flag="p}
        <div class="swiper-slide h-[200px] md:h-[400px] xl:h-[734px] flex items-center justify-center">
          {dreamer-cms:if test="('' eq [field:href/])"}
          <a  class="w-full h-full">
            {/dreamer-cms:if}
            {dreamer-cms:if test="('' neq [field:href/])"}
            <a href="[field:href/]" target="[field:target /]"  class="w-full h-full">
              {/dreamer-cms:if}
          
            <img src="[field:litpic /]" class="w-full h-full object-cover" alt="" />
          </a>
        </div>
        {/dreamer-cms:list}
      </div>
      <div class="swiper-pagination xl:hidden"></div>
      <div class="swiper-button-next !text-[#FFCB51] !hidden xl:!flex"></div>
      <div class="swiper-button-prev !text-[#FFCB51] !hidden xl:!flex"></div>
    </div>

    <div class="container mx-auto px-4 py-4 xl:py-8">
      <!-- 惠和安教体验馆 -->
      <div class="w-full my-10 md:my-6 xl:my-20">
        {dreamer-cms:type typeid="4ehpi418"}
        <div class="w-full text-center text-lg xl:text-2xl">[field:typenamecn /]</div>
        {/dreamer-cms:type}

        <div class="grid grid-cols-1 xl:grid-cols-3 gap-8 mt-8 xl:mt-16">
          {dreamer-cms:channel typeid="4ehpi418" length="3" showall="true" type="son"}
          <div class="flex flex-col justify-center items-center mt-10 xl:mt-4">
            <div class="flex flex-col justify-center items-center">
              <img src="[field:typeimg /]" class="w-[98px] h-[98px] mb-8" alt="" />
              <div class="ml-3">
                <p class="text-[18px] text-center">[field:typenamecn /]</p>
                <p class="text-xs text-center">[field:typenameen /]</p>
              </div>
            </div>
            
            <p class="text-sm  mt-4 xl:mt-6 w-[80%] md:w-[70%] lg:w-[60%] line-clamp-3 h-[60px]">
              [field:description /]
            </p>
            {dreamer-cms:if test="('' eq [field:linkurl/])"}
            <a href="[field:typeurl /]"
              class="w-32 h-8 bg-[#FFB300] hover:bg-[#FFA000] cursor-pointer rounded-2xl flex items-center justify-center mt-8 xl:mt-12 text-sm xl:text-base hover:scale-105 transition-transform">
              {/dreamer-cms:if}
              {dreamer-cms:if test="('' neq [field:linkurl/])"}
              <a href="[field:linkurl /]"
                class="w-32 h-8 bg-[#FFB300] hover:bg-[#FFA000] cursor-pointer rounded-2xl flex items-center justify-center mt-8 xl:mt-12 text-sm xl:text-base hover:scale-105 transition-transform">
                {/dreamer-cms:if}
              <span >查看更多</span>
            </a>
          </div>
          {/dreamer-cms:channel}
        </div>
      </div>
    </div>
    <!-- 体验项目 -->
    <div class="w-full xl:h-[1031px] px-6 xl:px-14 pb-14 bg-[url(../images/xm_bg.png)] bg-cover bg-no-repeatl">
      {dreamer-cms:type typeid="rd9xlta8"}
      <p class="text-6 font-medium text-center text-lg xl:text-2xl pt-10 pb-8 xl:pt-40 xl:pb-32 text-[#191919]">[field:typenamecn /]</p>
      {/dreamer-cms:type}

      <div class="container mx-auto grid grid-cols-1 xl:grid-cols-2 gap-8">
        {dreamer-cms:type typeid="xb52q887"}
        {dreamer-cms:if test="('' eq [field:linkurl/])"}
        <a href="[field:typeurl /]"
          class="relative w-full aspect-[1.4/1] rounded-2xl hover:scale-105 transition-transform duration-300">
          {/dreamer-cms:if}
          {dreamer-cms:if test="('' neq [field:linkurl/])"}
          <a href="[field:linkurl /]"
            class="relative w-full aspect-[1.4/1] rounded-2xl hover:scale-105 transition-transform duration-300">
            {/dreamer-cms:if}
       
          <img src="[field:typeimg /]" class="w-full h-full object-cover rounded-2xl" alt="" />
          <p
            class="absolute bottom-0 left-0 pl-6 xl:pl-10 text-xl xl:text-2xl font-medium flex items-center bg-[rgba(0,0,0,0.5)] rounded-b-2xl w-full h-[50px] xl:h-[80px] text-[#E0E4E8]">
            [field:typenamecn /]
          </p>
        </a>
        {/dreamer-cms:type}

        <div class="w-full  flex flex-col justify-between">
          <div class="grid grid-cols-1 xl:grid-cols-2 gap-8 mb-8 lg:mb-0">
            {dreamer-cms:type typeid="422u0h70"}
            {dreamer-cms:if test="('' eq [field:linkurl/])"}
            <a href="[field:typeurl /]"
              class="relative w-full aspect-[1.5/1] lg:aspect-[1/1] rounded-2xl hover:scale-105 transition-transform duration-300">
              {/dreamer-cms:if}
              {dreamer-cms:if test="('' neq [field:linkurl/])"}
              <a href="[field:linkurl /]"
                class="relative w-full aspect-[1.5/1] lg:aspect-[1/1] rounded-2xl hover:scale-105 transition-transform duration-300">
                {/dreamer-cms:if}
              <img src="[field:typeimg /]" class="w-full h-full object-cover rounded-2xl" alt="" />
              <p
                class="absolute bottom-0 left-0 pl-6 xl:pl-10 text-xl xl:text-2xl font-medium flex items-center bg-[rgba(0,0,0,0.5)] rounded-b-2xl w-full h-[50px] xl:h-[80px] text-[#E0E4E8]">
                [field:typenamecn /]
              </p>
            </a>
            {/dreamer-cms:type}
            {dreamer-cms:type typeid="tvoya6vg"}
            {dreamer-cms:if test="('' eq [field:linkurl/])"}
            <a href="[field:typeurl /]"
              class="relative w-full aspect-[1.5/1] lg:aspect-[1/1] rounded-2xl hover:scale-105 transition-transform duration-300">
              {/dreamer-cms:if}
              {dreamer-cms:if test="('' neq [field:linkurl/])"}
              <a href="[field:linkurl /]"
                class="relative w-full aspect-[1.5/1] lg:aspect-[1/1] rounded-2xl hover:scale-105 transition-transform duration-300">
                {/dreamer-cms:if}
            
              <img src="[field:typeimg /]" class="w-full h-full object-cover rounded-2xl" alt="" />
              <p
                class="absolute bottom-0 left-0 pl-6 xl:pl-10 text-xl xl:text-2xl font-medium flex items-center bg-[rgba(0,0,0,0.5)] rounded-b-2xl w-full h-[50px] xl:h-[80px] text-[#E0E4E8]">
                [field:typenamecn /]
              </p>
            </a>
            {/dreamer-cms:type}
          </div>
          <div class="grid grid-cols-1 xl:grid-cols-3 gap-8 ">
            {dreamer-cms:type typeid="8s6h9o7s"}
            {dreamer-cms:if test="('' eq [field:linkurl/])"}
            <a href="[field:typeurl /]"
              class="relative w-full aspect-[1.6/1] rounded-2xl hover:scale-105 transition-transform duration-300">
              {/dreamer-cms:if}
              {dreamer-cms:if test="('' neq [field:linkurl/])"}
              <a href="[field:linkurl /]"
                class="relative w-full aspect-[1.6/1] rounded-2xl hover:scale-105 transition-transform duration-300">
                {/dreamer-cms:if}
            
              <img src="[field:typeimg /]" class="w-full h-full object-cover rounded-2xl" alt="" />
              <p
                class="absolute bottom-0 left-0 pl-6 xl:pl-10 text-xl xl:text-2xl font-medium flex items-center bg-[rgba(0,0,0,0.5)] rounded-b-2xl w-full h-[50px] xl:h-[58px] text-[#E0E4E8]">
                [field:typenamecn /]
              </p>
            </a>
            {/dreamer-cms:type}
            {dreamer-cms:type typeid="8949smp6"}
            {dreamer-cms:if test="('' eq [field:linkurl/])"}
            <a href="[field:typeurl /]"
              class="relative w-full aspect-[1.6/1] rounded-2xl hover:scale-105 transition-transform duration-300">
              {/dreamer-cms:if}
              {dreamer-cms:if test="('' neq [field:linkurl/])"}
              <a href="[field:linkurl /]"
                class="relative w-full aspect-[1.6/1] rounded-2xl hover:scale-105 transition-transform duration-300">
                {/dreamer-cms:if}
           
              <img src="[field:typeimg /]" class="w-full h-full object-cover rounded-2xl" alt="" />
              <p
                class="absolute bottom-0 left-0 pl-6 xl:pl-10 text-xl xl:text-2xl font-medium flex items-center bg-[rgba(0,0,0,0.5)] rounded-b-2xl w-full h-[50px] xl:h-[58px] text-[#E0E4E8]">
                [field:typenamecn /]
              </p>
            </a>
            {/dreamer-cms:type}
            {dreamer-cms:type typeid="8964474m"}
            {dreamer-cms:if test="('' eq [field:linkurl/])"}
            <a href="[field:typeurl /]"
              class="relative w-full aspect-[1.6/1] rounded-2xl hover:scale-105 transition-transform duration-300">
              {/dreamer-cms:if}
              {dreamer-cms:if test="('' neq [field:linkurl/])"}
              <a href="[field:linkurl /]"
                class="relative w-full aspect-[1.6/1] rounded-2xl hover:scale-105 transition-transform duration-300">
                {/dreamer-cms:if}
            
              <img src="[field:typeimg /]" class="w-full h-full object-cover rounded-2xl" alt="" />
              <p
                class="absolute bottom-0 left-0 pl-6 xl:pl-10 text-xl xl:text-2xl font-medium flex items-center bg-[rgba(0,0,0,0.5)] rounded-b-2xl w-full h-[50px] xl:h-[58px] text-[#E0E4E8]">
                [field:typenamecn /]
              </p>
            </a>
            {/dreamer-cms:type}
          </div>
        </div>
      </div>
    </div>

    <!-- 活动预告 -->
    <div class="container mx-auto px-4 pb-10 xl:pb-32">
      {dreamer-cms:type typeid="08yhy73j"}
      <p class="text-6 font-medium text-center text-lg xl:text-2xl pt-10 pb-8 xl:pt-40 xl:pb-32 text-[#191919]">[field:typenamecn /]</p>
      {/dreamer-cms:type}
      <div class="flex items-center justify-between">
        <div class="swiper-button-prev2">
          <img src="{dreamer-cms:template /}images/swiper_prev.png" class="w-16 h-16 md:w-20 md:h-20 xl:w-24 xl:h-24"
            alt="上一页" />
        </div>
        <div class="swiper myMultiSwiper w-[80%]">
          <div class="swiper-wrapper">
            {dreamer-cms:list typeid="08yhy73j" showall="false" type="son"}

            <div class="swiper-slide relative">
              <a href="[field:arcurl /]" class="w-full h-full">
                <img src="[field:litpic /]" class="w-full h-full object-cover rounded-2xl" alt="" />
                <div
                  class="absolute inset-0 rounded-2xl bg-black/70 opacity-0 hover:opacity-100 transition-opacity duration-300 flex flex-col items-center justify-center text-base md:text-xl xl:text-3xl font-medium text-[#E0E4E8]">
                  <p>[field:title /]</p>
                  <p>[field:remark /]</p>
                </div>
              </a>
            </div>

            {/dreamer-cms:list}
          </div>
          <!-- 自定义导航按钮 -->
        </div>
        <div class="swiper-button-next2">
          <img src="{dreamer-cms:template /}images/swiper_next.png" class="w-16 h-16 md:w-20 md:h-20 xl:w-24 xl:h-24"
            alt="下一页" />
        </div>
      </div>
      {dreamer-cms:type typeid="08yhy73j"}
      <a href="[field:typeurl /]"
        class="w-48 h-12 bg-[#FFB300] hover:bg-[#FFA000] mx-auto cursor-pointer rounded-3xl flex items-center justify-center mt-8 xl:mt-12 text-sm xl:text-lg hover:scale-105 transition-transform">
        <span >查看更多</span>
      </a>
      {/dreamer-cms:type}
    </div>
  </main>
  <div class="fixed right-0 lg:right-4 top-2/3 -translate-y-1/2 z-50">
    <div class="flex flex-col space-y-0 lg:space-y-3">
      <!-- 微信 -->
      <div class="relative group">
        <button
          class="bg-[#FFE9B5] hover:bg-[#FFC848] scale-75 lg:scale-100 rounded-lg w-12 h-12 flex items-center justify-center">
          <svg t="1748336657848" class="icon w-8 h-8 text-[#262626]" viewBox="0 0 1024 1024" version="1.1"
            xmlns="http://www.w3.org/2000/svg" p-id="2739">
            <path
              d="M867.265306 867.265306c-3.134694 0-6.791837-1.044898-9.92653-2.612245l-54.857143-28.734694c-39.183673 20.37551-83.069388 31.346939-128.522449 31.346939-141.061224 0-256-102.922449-256-229.877551s114.938776-229.877551 256-229.877551 256 102.922449 256 229.877551c0 50.677551-18.808163 100.310204-53.289796 140.538776l10.971428 65.306122c1.567347 7.836735-2.089796 15.673469-8.359183 20.37551-3.657143 2.089796-7.836735 3.657143-12.016327 3.657143z m-193.306122-417.959184c-118.073469 0-214.204082 84.114286-214.204082 188.081633s96.130612 188.081633 214.204082 188.081633c42.318367 0 83.069388-10.971429 118.073469-31.346939 6.269388-3.657143 14.106122-3.657143 20.37551-0.522449l27.167347 14.106122-5.746939-33.436734c-1.044898-6.269388 1.044898-13.061224 5.22449-17.763266 31.346939-33.436735 49.110204-76.277551 49.110204-119.640816 0-103.444898-96.130612-187.559184-214.204081-187.559184z"
              p-id="2740"></path>
            <path
              d="M579.918367 579.395918m-31.346938 0a31.346939 31.346939 0 1 0 62.693877 0 31.346939 31.346939 0 1 0-62.693877 0Z"
              p-id="2741"></path>
            <path
              d="M768 579.395918m-31.346939 0a31.346939 31.346939 0 1 0 62.693878 0 31.346939 31.346939 0 1 0-62.693878 0Z"
              p-id="2742"></path>
            <path
              d="M292.571429 344.293878m-36.571429 0a36.571429 36.571429 0 1 0 73.142857 0 36.571429 36.571429 0 1 0-73.142857 0Z"
              p-id="2743"></path>
            <path
              d="M512 344.293878m-36.571429 0a36.571429 36.571429 0 1 0 73.142858 0 36.571429 36.571429 0 1 0-73.142858 0Z"
              p-id="2744"></path>
            <path
              d="M166.138776 709.485714c-4.179592 0-8.881633-1.567347-12.538776-4.179592-6.269388-4.702041-9.404082-12.538776-8.359184-20.37551l14.106123-81.502041C117.028571 554.840816 94.040816 494.759184 94.040816 433.110204 94.040816 280.555102 232.489796 156.734694 402.285714 156.734694c80.979592 0 157.257143 27.689796 215.24898 78.889796 58.514286 51.2 91.428571 119.640816 92.995918 193.306122 0 5.746939-2.089796 11.493878-6.269388 15.67347s-9.926531 6.269388-15.673469 5.746938c-5.22449-0.522449-9.926531-0.522449-14.106122-0.522449-118.073469 0-214.204082 84.114286-214.204082 188.081633 0 14.106122 2.089796 28.734694 5.746939 42.840816 1.567347 5.746939 0.522449 12.016327-2.612245 17.240817s-8.881633 8.359184-14.628572 8.881632c-15.15102 2.089796-30.302041 3.134694-45.453061 3.134694-55.902041 0-109.714286-13.583673-157.257143-38.661224l-68.963265 36.571428c-4.179592 0.522449-7.836735 1.567347-10.971428 1.567347z m78.889795-83.591836c3.657143 0 7.314286 1.044898 10.44898 2.612244 48.587755 28.212245 106.057143 41.795918 164.571429 38.138776-1.567347-9.926531-2.089796-19.853061-2.089796-29.779592 0-124.865306 111.281633-226.742857 249.208163-229.877551-14.628571-117.028571-128.522449-208.979592-264.881633-208.979592-146.808163 0-266.44898 105.012245-266.448979 234.579592 0 54.334694 21.942857 107.62449 61.12653 149.420408 4.702041 4.702041 6.269388 11.493878 5.22449 17.763266l-8.359184 50.155102 41.795919-21.942858c3.134694-1.044898 6.269388-2.089796 9.404081-2.089795z"
              p-id="2745"></path>
          </svg>
        </button>
        <div
          class="hidden group-hover:block absolute left-[-160px] top-1/2 -translate-y-1/2 bg-white p-2 rounded shadow">
          {dreamer-cms:type typeid="5838nalu"}
          <div class="flex flex-col items-center justify-center ">
            <p class="mt-2">[field:typenamecn /]</p>
            <img src="[field:typeimg /]" alt="微信二维码" class="w-32 h-32">
          </div>

          {/dreamer-cms:type}
        </div>
      </div>
      <!-- 留言 -->
      <button
        class="bg-[#FFE9B5] hover:bg-[#FFC848] scale-75 lg:scale-100 text-[#262626] rounded-lg w-12 h-12 flex items-center justify-center"
        id="openMessageModal">
        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
          class="w-6 h-6">
          <path stroke-linecap="round" stroke-linejoin="round"
            d="M2.25 12.76c0 1.6 1.123 2.994 2.707 3.227 1.087.16 2.185.283 3.293.369V21l4.076-4.076a1.526 1.526 0 011.037-.443 48.282 48.282 0 005.68-.494c1.584-.233 2.707-1.626 2.707-3.228V6.741c0-1.602-1.123-2.995-2.707-3.228A48.394 48.394 0 0012 3c-2.392 0-4.744.175-7.043.513C3.373 3.746 2.25 5.14 2.25 6.741v6.018z" />
        </svg>
      </button>
      <!-- 置顶 -->
      <button
        class="bg-[#FFE9B5] hover:bg-[#FFC848] scale-75 lg:scale-100 text-[#262626] rounded-lg w-12 h-12 flex items-center justify-center"
        id="scrollToTop">
        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
          class="w-6 h-6">
          <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 15.75l7.5-7.5 7.5 7.5" />
        </svg>
      </button>
    </div>
  </div>

  <!-- 留言弹窗 -->
  <div id="messageModal" class="fixed inset-0 bg-gray-900 bg-opacity-50 hidden justify-center items-center z-50 flex">
    <div class="bg-white p-6 rounded shadow-lg w-full max-w-md m-auto">

      <h2 class="text-xl font-bold mb-4">留言</h2>
      <form id="messageForm" action="/input" method="post">
        <input type="hidden" name="typeid" value="31x78u1b" />
        <input type="hidden" name="formkey" value="8t2lkr8d" />
        <div class="mb-4">
          <label for="username" class="block mb-1">姓名</label>
          <input type="text" id="username" name="username" class="w-full border rounded px-3 py-2">
        </div>
        <div class="mb-4">
          <label for="telephone" class="block mb-1">联系电话</label>
          <input type="text" id="telephone" name="telephone" class="w-full border rounded px-3 py-2" required>
        </div>
        <div class="mb-4">
          <label for="title" class="block mb-1">标题</label>
          <input type="text" id="title" name="title" class="w-full border rounded px-3 py-2">
        </div>

        <div class="mb-4">
          <label for="content" class="block mb-1">留言内容</label>
          <textarea id="content" name="content" class="w-full border rounded px-3 py-2" rows="4" required></textarea>
        </div>
        <div class="mb-4 flex items-center space-x-4">
          <div class="login-form-vcode">
            <img alt="图片验证码" width="120" height="46" src="/getKaptcha" id="vcode"
              class="cursor-pointer hover:opacity-80 transition-opacity duration-300">
          </div>
          <div class="login-form-vcode-input flex-grow">
            <input type="text" name="captcha" placeholder="验证码" required="required"
              class="w-full border border-gray-300 rounded px-3 py-2 focus:outline-none focus:ring-yellow-500 focus:border-yellow-500" />
          </div>
        </div>
        <div class="flex justify-center">
          <button id="essentialInformation" type="button"
            class="bg-yellow-500 hover:bg-yellow-600 text-white rounded px-4 py-2">提交</button>
          <button type="button" id="closeMessageModal"
            class="ml-2 bg-gray-300 hover:bg-gray-400 rounded px-4 py-2">关闭</button>
        </div>

      </form>
    </div>
  </div>

  <!-- 页脚 -->
  {dreamer-cms:include file="inc/footer.html" /}
  <!-- JavaScript -->
  <script>
    // 初始化Swiper
    const swiper = new Swiper('.mySwiper', {
      loop: true,
      pagination: {
        el: '.swiper-pagination',
        clickable: true,
        bulletActiveClass: 'swiper-pagination-bullet-active'
      },
      navigation: {
        nextEl: '.swiper-button-next',
        prevEl: '.swiper-button-prev'
      },
      autoplay: {
        delay: 5000,
        disableOnInteraction: false
      }
    })

    // 初始化 Swiper
    const multiSwiper = new Swiper('.myMultiSwiper', {
      slidesPerView: 1, // 默认显示 1 张图片
      spaceBetween: 30, // 图片之间的间距
      loop: false, // 不循环播放
      autoplay: false, // 不自动轮播
      navigation: {
        nextEl: '.swiper-button-next2',
        prevEl: '.swiper-button-prev2'
      },
      breakpoints: {
        // 当屏幕宽度 >= 640px 时显示 2 张图片
        640: {
          slidesPerView: 2
        },
        // 当屏幕宽度 >= 1024px 时显示 3 张图片
        1024: {
          slidesPerView: 3
        }
      }
    })
    // 打开留言弹窗
    const openMessageModalBtn = document.getElementById('openMessageModal');
    const messageModal = document.getElementById('messageModal');
    openMessageModalBtn.addEventListener('click', () => {
      messageModal.classList.remove('hidden');

    });

    // 关闭留言弹窗
    const messageForm = document.getElementById('messageForm');
    const closeMessageModalBtn = document.getElementById('closeMessageModal');
    closeMessageModalBtn.addEventListener('click', () => {
      messageModal.classList.add('hidden');
      messageForm.reset(); // 关闭时重置表单
    });

    // 点击背景关闭弹窗
    messageModal.addEventListener('click', (e) => {
      if (e.target === messageModal) {
        messageModal.classList.add('hidden');
        // $('#messageModal').hide();
        messageForm.reset(); // 关闭时重置表单
      }
    });

    // 置顶功能
    const scrollToTopBtn = document.getElementById('scrollToTop');
    scrollToTopBtn.addEventListener('click', () => {
      window.scrollTo({ top: 0, behavior: 'smooth' });
    });

    // 表单提交逻辑（示例，可根据实际需求修改）
    // const messageForm = document.getElementById('messageForm');
    // messageForm.addEventListener('submit', (e) => {
    //   e.preventDefault();
    //   // 这里可以添加表单提交的逻辑
    //   console.log('表单提交');
    //   messageModal.classList.add('hidden');
    //   messageForm.reset();
    // });
    $(function () {
      $("#vcode").attr("src", "/getKaptcha?t=" + new Date().getTime());

      $("#vcode").click(function () {
        var t = new Date().getTime();
        $(this).attr("src", "/getKaptcha?t=" + t);
      });

      $("#essentialInformation").click(function () {
        var title = $("input[name='title']").val();
        var username = $("input[name='username']").val();
        var phone = $("input[name='telephone']").val();
        var content = $("textarea[name='content']").val();
        var captcha = $("input[name='captcha']").val();
        var rsd = /^1[3|4|5|6|7|8|9]\d{9}$/;
        var regex = new RegExp(rsd);
        if (!title) {
          layer.msg('填写留言标题', { icon: 5 });
          return false;
        }
        if (!phone) {
          layer.msg('填写您的联系电话', { icon: 5 });
          return false;
        }
        // if (!regex.test(phone)) {
        //   layer.msg('手机号有误', { icon: 5 });
        //   return false;
        // }
        if (!content) {
          layer.msg('填写您的留言内容', { icon: 5 });
          return false;
        }
        if (!captcha) {
          layer.msg('填写验证码', { icon: 5 });
          return false;
        }
        var formData = $("#messageForm").serialize();
        $.ajax({
          url: "/input",
          data: formData,
          type: "post",
          dataType: "JSON",
          success: (result) => {
            if (result.state === '200') {
              layer.msg('提交成功!', { icon: 1 });
              // $('#messageModal').hide();
              messageModal.classList.add('hidden');
              messageForm.reset(); // 关闭时重置表单
            } else {
              layer.msg(result.info, { icon: 2 });

            }
          }
        });
      })
    })
  </script>
</body>

</html>